<!-- 编辑弹窗 -->
<template>
  <div>
  <el-dialog
    title="补差申请明细"
    :visible="visible"
    width="460px"
    :fullscreen="true"
    :destroy-on-close="true"
    :lock-scroll="false"
    @update:visible="updateVisible"
    @open="loadSummary">
    <el-form
      ref="form"
      :model="form"
      style="margin-bottom: 10px"
      label-width="82px">
      <el-row>
        <el-col :md="4" :sm="12">
          <el-form-item label="申请日期:">
            <el-date-picker disabled v-model="form.sqrq" type="date" format='yyyy-MM-dd' value-format='yyyy-MM-dd' clearable class="ele-fluid"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :md="4" :sm="12">
          <el-form-item label="申请单号:">
            <el-input disabled v-model="form.sqdh"></el-input>
          </el-form-item>
        </el-col>
        <el-col :md="5" :sm="12">
          <el-form-item label="补差依据:" prop="bcyjqs">
            <el-select
              disabled multiple
              v-model="form.bcyjList"
              placeholder="请选择补差依据"
              class="ele-fluid">
              <el-option v-for="item in bcyjList"
                         :key="item.id"
                         :label="item.bcname"
                         :value="String(item.id)"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :md="4" :sm="12">
          <el-form-item label="客户编码:">
            <el-input
              disabled
              v-model="form.custcode"
              placeholder=""/>
          </el-form-item>
        </el-col>
        <el-col :md="6" :sm="12">
          <el-form-item label="客户名称:">
            <el-input
              disabled
              v-model="form.custname"
              placeholder=""/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :md="4" :sm="12">
          <el-form-item label="客户类型:" prop="khlx">
            <el-select
              disabled
              v-model="form.khlx"
              placeholder="请选择客户类型"
              class="ele-fluid">
              <el-option label="医院" value="医院"/>
              <el-option label="商业" value="商业"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :md="9" :sm="12">
          <el-form-item label="客户地址:">
            <el-select
              clearable multiple disabled
              v-model="form.custAddr"
              class="ele-fluid">
              <el-option v-for="item in custaddrList"
                         :key="item.pkaddress"
                         :label="item.custaddress"
                         :value="item.pkaddress"
                        />
            </el-select>
          </el-form-item>
        </el-col>         
        <el-col :md="4" :sm="12">
          <el-form-item label="补差类型:" prop="bclx">
            <el-select
              disabled
              v-model="form.bclx"
              placeholder="请选择补差类型"
              class="ele-fluid">
              <el-option label="票扣" value="票扣"/>
              <el-option label="折让" value="折让"/>
              <el-option label="红蓝对冲" value="红蓝对冲"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :md="12" :sm="12">
          <el-form-item label="盖章附件:">
            <a v-bind:href="rootURL+'uploads/'+form.uploadfile" target="_blank" style="text-decoration: underline;">
              {{form.uploadfile?String(form.uploadfile).slice(String(form.uploadfile).indexOf('_')+1):''}}
            </a>
          </el-form-item>
        </el-col>  
      </el-row>
      <el-row v-if="form.khlx=='医院'">
        <el-col :md="22" :sm="12">
          <el-form-item label="阳光平台:">
            <el-checkbox v-model="form.saleOrderSubstuted" @change="saleOrderSubstutedChanged">正票订单代填</el-checkbox>
            <el-checkbox v-model="form.reOrderSubstuted" @change="reOrderSubstutedChanged">负票订单代填</el-checkbox>
            <el-checkbox v-model="form.saleInvoicePost" @change="saleInvoicePostChanged">正票回传</el-checkbox>
            <el-checkbox v-model="form.reInvoiceUnrelated" @change="reInvoiceUnrelatedChanged">负票无关联回传</el-checkbox>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :md="23" :sm="12">
          <el-form-item label="备注:">
            <el-input type="textarea" style="margin-top:5px;"
              disabled
              v-model="form.bz"
              placeholder=""/>
          </el-form-item>
        </el-col>
      </el-row> 
    </el-form>
    <ele-pro-table
      title="补差产品明细"
      ref="tableSummary"
      :datasource="dataSummary"
      :columns="columnsSummary"
      :toolbar="true"
      :need-page="false"
      show-summary
      :summary-method="getTotalAmount"
      highlight-current-row
      height="calc((100vh - 110px)/2)"
      max-height="calc((100vh - 110px)/2)">
    </ele-pro-table>
    <ele-pro-table
      title="补差发票明细"
      ref="table"
      :datasource="dataInvoice"
      :columns="columns"
      :toolbar="true"
      :need-page="false"
      height="calc((100vh - 240px)/2)">
    </ele-pro-table>
  </el-dialog>
  </div>
</template>

<script>
import setting from "@/config/setting";
import { mapGetters } from "vuex";
export default {
  name: 'SpbcDetail',
  components:{},
  props: {
    // 弹窗是否打开
    visible: Boolean,
    // 修改回显的数据
    data: Object
  },
  computed: {
    ...mapGetters(["permission"]),
  },
  mounted() {
    this.getBcyjList();
  },
  data() {
    return {
      baseURL:setting.baseURL,
      rootURL:setting.rootURL,
      // 表单数据
      form: {
        sqr:'',
        sqbm:'',
        sqrq:new Date(),
        custname:'',
        custcode:'',
        bcyjqs:'',
        bclx:'',
        khlx:'医院',
        bz:'',
        uploadfile:''
      },
      currentInv:{},
      bcyjList:[], //补差依据列表
      dataList:[],
      dataSummary:[],
      dataInvoice:[],
      showUpload:false,
      custaddrList:[],
      columns: [
        {
          columnKey: 'index',
          type: 'index',
          label: '序号',
          width: 45,
          align: 'center',
          fixed: "left"
        },  
        {
          prop: 'invcode',
          label: '商品编码',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        {
          prop: 'invname',
          label: '商品名称',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'left'
        },
        {
          prop: 'dbilldate',
          label: '原销售日期',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'center'
        },
        {
          prop: 'vgoldtaxcode',
          label: '原发票',
          showOverflowTooltip: true,
          minWidth: 150,
          align: 'left'
        },
        {
          prop: 'vlotno',
          label: '批号',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'left'
        },
        {
          prop: 'nastnum',
          label: '原销售数量',
          showOverflowTooltip: true,
          minWidth: 90,
          align: 'center'
        },
        {
          prop: 'quantity',
          label: '核销数量',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center',
        },
        {
          prop: 'nqtorigtaxprice',
          label: '原销售价(含税)',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },
        {
          prop: 'norigtaxmny',
          label: '含税金额',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'center'
        },
        {
          prop: 'norigmny',
          label: '无税金额',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'center'
        },
        {
          prop: 'ywy',
          label: '业务员',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        {
          prop: 'custaddress',
          label: '客户地址',
          showOverflowTooltip: true,
          minWidth: 200,
          align: 'left'
        }
      ],
      columnsSummary: [
        {
          columnKey: 'index',
          type: 'index',
          label: '序号',
          width: 45,
          align: 'center',
          fixed: "left"
        },  
        {
          prop: 'invcode',
          label: '商品编码',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'center'
        },
        {
          prop: 'invname',
          label: '商品名称',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'left'
        },
        {
          prop: 'gg',
          label: '规格',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'left'
        },
        {
          prop: 'materialunit',
          label: '单位',
          showOverflowTooltip: true,
          minWidth: 50,
          align: 'center'
        },
        {
          prop: 'manufacturer',
          label: '生产厂家',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'left'
        },
        {
          prop: 'vlotno',
          label: '批号',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'left'
        },
        {
          prop: 'nqtorigtaxprice',
          label: '含税单价',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        {
          prop: 'nqtorigprice',
          label: '无税单价',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        {
          prop: 'nastnum',
          label: '原销售数量',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'center'
        },
        {
          prop: 'balancenum',
          label: '补差数量',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center',
        },
        {
          prop: 'nowsaleprice',
          label: '现销售价',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        {
          prop: 'diffprice',
          label: '差价',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        {
          prop: 'balanceamount',
          label: '补差金额(含税)',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },
        {
          prop: 'cgy',
          label: '采购员',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }
      ],
    };
  },
  methods: {
    loadSummary(){
      if (this.data) {
        this.form = Object.assign({}, this.data);
        let param = {
          pid:this.data.id,
          custcode:this.form.custcode
        };
        this.$http.get('/spbc/detail',{params:param}).then(res=>{
          if(res.status==200)
          {
            this.dataSummary = res.data.data;
            this.$nextTick(() => {
              this.$refs['tableSummary'].doLayout();
            });
          }
        });
        this.$http.get('/spbc/invoicedetail',{params:param}).then(res=>{
          if(res.status==200)
          {
            this.dataInvoice=res.data.data;
          }
        });
        this.getCustAddrList(this.form.custcode);
      }
      else{
        this.form={};
        this.form.sqrq = new Date();
        this.dataSummary=[];
        this.dataInvoice=[];
      }
    },
    async getBcyjList(){
      var res = await this.$http.get('/spbcinvset/index?page=1&limit=1000');
      //console.log(res);
      if(res.status==200)
      {
        this.bcyjList = res.data.data.records;
      }

    },
    getCustAddrList(custcode){
      this.$http.get('/spbc/getCustAddrList?custcode='+custcode).then(res => {
          if (res.data.code === 0) {
            this.custaddrList = res.data.data;
          }
      });
    },
    /* 更新visible */
    updateVisible(value) {
      this.$emit('update:visible', value);
    },
    tableRowClassName({ row, rowIndex }) {
      row.index = rowIndex;
    },
    getTotalAmount(param) {
        const { columns, data } = param;
        const sums = {};
        columns.forEach((column, index) => { 
            if (index === 0) {
                sums[index] = '合计';
                return;
            }          
            const values = data.map(item => Number(item[column.property]));
            if (column.label == "补差金额(含税)") {
              if (!values.every(value => isNaN(value))) {
                  sums[index] = values.reduce((prev, curr) => {
                      const value = Number(curr);
                      if (!isNaN(value)) {
                          return parseFloat((prev + curr).toFixed(2));
                      } else {
                          return parseFloat(prev.toFixed(2));
                      }
                  }, 0);
                  
              } 
            }
        });
        return sums;
    },
  }
}
</script>

<style scoped>
::v-deep .el-dialog__body {
  padding-top: 5px;
  padding-bottom: 5px;
}
.el-row {
  margin-bottom: -15px;
}
.el-row1 {
  margin-bottom: 5px;
  margin-top: 1px;
  display: flex;
  flex-wrap: wrap
}
</style>
